<template>
	<xn-print-design
		ref="xnPrintDesignRef"
		@back="back"
		@save="save"
		:loading="loading"
		:button="['back', 'save', 'preview', 'print', 'export', 'json', 'clear']"
	/>
</template>

<script setup name="printDesign">
	import { message } from 'ant-design-vue'
	import templatePrintApi from '@/api/flw/templatePrintApi'
	const emit = defineEmits({ back: null })
	const loading = ref(false)
	const recordData = ref({})
	const xnPrintDesignRef = ref()

	// 打开界面
	const onOpen = async (record) => {
		recordData.value = record
		const param = {
			id: record.id
		}
		loading.value = true
		let dataResult = await templatePrintApi.templatePrintDetail(param)
		loading.value = false
		if (dataResult.content) {
			xnPrintDesignRef.value.init(JSON.parse(dataResult.content))
			return
		}
		xnPrintDesignRef.value.init()
	}
	// 保存
	const save = (value) => {
		const param = {
			id: recordData.value.id,
			content: value
		}
		loading.value = true
		templatePrintApi
			.templatePrintDesign(param)
			.then(() => {
				message.success('操作成功')
			})
			.finally(() => {
				loading.value = false
			})
	}
	// 打印
	const onPrint = () => {
		xnPrintDesignRef.value.print()
	}
	// 返回
	const back = () => {
		xnPrintDesignRef.value.clear()
		emit('back')
	}
	// 暴露方法
	defineExpose({
		onOpen,
		onPrint
	})
</script>
